<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>lotex.Report</title>

<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />

<!-- LIBS -->
<script type="text/javascript" src="../../jquery-latest.pack.js"></script>
<script type="text/javascript" src="../../jquery-plugins.js"></script>
<!-- ENDLIBS -->
<script type="text/javascript" src="../../ext-jquery-adapter.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="../examples.css" />
</head>
<body>
<div id="test"></div>
</body>
</html>
<script type="text/javascript" src="lotex-all.js"></script>
<script type="text/javascript">
// 初始化画布
// TODO auto detect and init
var G = lotex.gfx.Draw;
var canvas = G.canvas().id('test').x(100).y(100)
    .width(800).height(400)
    .on(document.getElementById("test"));

function cross(x,y) {
    var style = {stroke:'green','stroke-width':'1px'};
    G.line().x1(x-20).y1(y).x2(x+20).y2(y).stroke('red').strokeWidth(1)
        .style(style).on(canvas);
    G.line().x1(x).y1(y-20).x2(x).y2(y+20).stroke('red').strokeWidth(1)
        .style(style).on(canvas);
}
x=100,y=100;
cross(x,y);
var tcc = new CollisionCheck();

G.text().x(x).y(y).text('ABCD').cc(tcc).anchor('start').on(canvas);
x+=28;
G.text().x(x).y(y).text('ABCD').cc(tcc).anchor('start').on(canvas);
</script>